import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import "../search.dart";
import "../form.dart";
import "../news.dart";
import "../hero.dart";

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

// class _HomePageState extends State<HomePage> {
//   @override
//   Widget build(BuildContext context) {
//     return Center(
//       child: Text('首页'),
//     );
//   }
// }
class _HomePageState extends State<HomePage>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;
  @override
  void initState() {
    super.initState();
    _tabController = TabController(length: 8, vsync: this);
    _tabController.addListener(() {
      // 监听 TabBar 的切换方式1 ,但是会获取两次，需要判断
      if (_tabController.index == _tabController.animation?.value) {
        print(_tabController.index);
      }
    });
  }

  Widget build(BuildContext context) {
    return Scaffold(
      // PreferredSize 可以配置appbar高度
      appBar: PreferredSize(
        preferredSize: const Size.fromHeight(40),
        child: AppBar(
          backgroundColor: Colors.white,
          // 修改 TabBar 高度
          title: SizedBox(
            height: 40,
            child: TabBar(
              // 监听 TabBar 的切换方式2, 但是滑动切换无法监听，建议方式1
              // onTap: (index) {
              //   print(index);
              // },
              controller: _tabController,
              isScrollable: true,
              tabAlignment: TabAlignment.start, // tab 靠左显示
              tabs: const [
                Tab(child: Text('关注')),
                Tab(child: Text('热门')),
                Tab(child: Text('视频')),
                Tab(child: Text('视频')),
                Tab(child: Text('视频')),
                Tab(child: Text('视频')),
                Tab(child: Text('视频')),
                Tab(child: Text('视频')),
              ],
              indicatorColor: Colors.red,
              labelColor: Colors.red,
              unselectedLabelColor: Colors.black,
              labelStyle: const TextStyle(fontSize: 20),
              unselectedLabelStyle: const TextStyle(fontSize: 14),
            ),
          ),
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: [
          ListView(
            children: [
              ElevatedButton(
                onPressed: () {
                  // TODO 基本路由跳转
                  Navigator.of(context).push(MaterialPageRoute(
                    builder: (context) => const SearchPage(),
                  ));
                },
                child: const Text('基本路由-跳转Search页面'),
              ),
              ElevatedButton(
                onPressed: () {
                  // TODO 基本路由跳转,并传值
                  Navigator.of(context).push(MaterialPageRoute(
                    builder: (context) =>
                        NewsPage(title: '我是标题', aid: '112233'),
                  ));
                },
                child: const Text('基本路由-跳转News页面,并传值'),
              ),
              ElevatedButton(
                onPressed: () {
                  // TODO 命名路由跳转
                  Navigator.of(context).pushNamed("/form", arguments: "hi");
                },
                child: const Text('命名路由-跳转form页面'),
              ),
              Container(
                child: InkWell(
                  onTap: () {
                    Navigator.of(context).pushNamed("/hero", arguments: "hi");
                  },
                  // TODO 飞入飞出 tag要相同
                  child: Hero(
                    tag: '111',
                    child: Image.network(
                      'https://cdn.uviewui.com/uview/album/1.jpg',
                    ),
                  ),
                ),
              ),
              const Divider(height: 30),
              const ListTile(title: Text('我是 关注 列表2')),
              const ListTile(title: Text('我是 关注 列表3')),
              const ListTile(title: Text('我是 关注 列表4')),
              const ListTile(title: Text('我是 关注 列表5')),
              const ListTile(title: Text('我是 关注 列表6')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表r44444444444')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表')),
              const ListTile(title: Text('我是 关注 列表666666666')),
            ],
          ),
          ListView(
            children: const [
              ListTile(title: Text('我是 热门 列表')),
            ],
          ),
          ListView(
            children: const [
              ListTile(title: Text('我是 视频 列表')),
            ],
          ),
          const ListTile(title: Text('我是 视频 列表1')),
          const ListTile(title: Text('我是 视频 列表32')),
          const ListTile(title: Text('我是 视频 列表4')),
          const ListTile(title: Text('我是 视频 列表5')),
          const ListTile(title: Text('我是 视频 列表6')),
        ],
      ),
    );
  }
}


// 缓存组件keepAlive
